<template>
    <div>
      <Header :position="positionTitle"></Header>
      <el-card style="height: 873px">
        <h3 slot="header">知识库数据管理</h3>
        <div style="float: right">
          <el-upload
            class="upload-demo"
            action="https://jsonplaceholder.typicode.com/posts/"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :before-remove="beforeRemove"
            multiple
            :limit="3"
            :on-exceed="handleExceed"
            :file-list="fileList">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </div>
        <el-table
          :data="tableData"
          height="690"
          style="width: 100%">
          <el-table-column type="expand">
            <template slot-scope="props">
<!--              <template>-->
                <div style="display: flex;flex-flow: column;width: 100%">
                    <el-card style="width: 100%" shadow="never">
                        <h3 slot="header">{{props.row.InfoName}}</h3>
                        <el-form label-width="150px" label-position="left" style="margin: 20px">
                            <el-form-item label="详细信息：">
                                <el-input autosize
                                          type="textarea"
                                          v-model="props.row.content"></el-input>
                            </el-form-item>

                        </el-form>
                        <div style="margin-top: 5%;text-align: center">
                            <el-button type="primary" size="medium">下载</el-button>
                            <el-button type="primary" size="medium">保存</el-button>
                        </div>
                    </el-card>
                </div>

            </template>
          </el-table-column>
          <el-table-column
            type="index"
            width="50">
          </el-table-column>
          <el-table-column
            label="专家知识名称"
            prop="InfoName">
          </el-table-column>
          <el-table-column
            label="专家姓名"
            prop="name">
          </el-table-column>
          <el-table-column
            align="center"
            prop="type">
<!--            <template  slot="header" slot-scope="scope">-->
            <template  slot="header">
              <el-select v-model="positionSelect" placeholder="报告类型" size="mini" @change="selectChange">
                <el-option v-for="item in positionSelectData" :key="item" size="mini"
                           :label="item.name" :value="item.value"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            label="时间"
            prop="time">
          </el-table-column>
          <el-table-column
            label="操作"
          >
            <template>
<!--            <template slot-scope="scope">-->
<!--            <el-button-->
<!--              size="mini" type="primary">下载</el-button>-->
            <el-button
              size="mini"
              type="danger"
            >删除</el-button>
          </template>
          </el-table-column>
        </el-table>
        <div style="margin-top: 10px;">
          <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage4"
                  :page-sizes="[10, 20, 50, 100]"
                  :page-size="20"
                  style="display: inline-block"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="400">
          </el-pagination>
        </div>
<!--        <div>-->
<!--          <label>知识库类型：</label>-->
<!--          <el-select v-model="positionSelect" placeholder="请选择知识库类型">-->
<!--            <el-option v-for="item in positionSelectData" :key="item" size="small"-->
<!--                       :label="item.name" :value="item.value"></el-option>-->
<!--          </el-select>-->
<!--        </div>-->
      </el-card>
    </div>
</template>

<script>
  import Header from "../Header";
  export default {
    name: 'KnowledgeCard',
    components:{Header},
    data(){
      return{
        positionSelect:'',
        positionSelectData:[{name:'类型',value:1}],
        tableData: [{
          name: '常濮存',
          InfoName:'关于发电机的常见故障',
          type:'类型',
          time:'2020-11-02',
          content:'在发电运行的过程中，由于各种原因产生各种故障，' +
              '无论其故障大小都要有效措施消除，并在故障处理前切断电源组，以免引发安全问题',
        }, {
          name: '崔光明',
          InfoName:'关于变桨系统的常见故障',
          type:'类型',
          time:'2020-11-03',
          content:'一般来说变桨故障主要一下几点，' +
              '（1）变桨CANOPEN通讯故障，主控和变桨通讯的连接为通讯CM202变桨防重和EPEC控制',
        }, {
          name: '张博赡',
          InfoName:'关于传动端轴承的常见故障',
          type:'类型',
          time:'2020-11-04',
          content:'一、润滑的原由' +
              '（1）轴承润滑油注入过多，超出轴承腔空间的三分之二，因润滑油传热效率不高，导致轴承热量散发较差。\n' +
              '（2）轴承缺油。供油过少供油经常中断导致干摩擦发热，不及时处理会使轴承烧坏。\n' +
              '（3）油品变质。未按时换油、油渗水乳化或密封性较差进入粉尘均导油品变质。',
        }, {
          name: '孔正浩',
          InfoName:'关于发电机的常见故障',
          type:'类型',
          time:'2020-11-06',
          content:'电动机温升过高或冒烟\n' +
              '这种故障是电动机过热的表现。其原因很多：既有电动机外部的因素(如电源供电质量差、负载过大、环境温度高和通风不良等等)；也有电动机自身的原因。\n' +
              '电动机本身常见原因及对策：\n' +
              '1.绕组接法有错，误将星形接成三角形或相反。\n' +
              '2.定子绕组匝间或相间短路或接地，使电流增大，铜损增加。若故障不严重只需要重包绝缘，严重的应更换绕组。',
        },],
        positionTitle:{
          secondTitle:'操作管理' ,
          thirdTitle:'知识库管理',
          routeString:'/DataManagement/DateFile'
        },
      }
    }
  }
</script>

<style scoped>

</style>
